import 'package:flutter/material.dart';
import 'package:sample2/helper/app_helper.dart';
import 'package:sample2/pages/home/product/product_detail.dart';
import 'package:sample2/pages/home/product/product_search_history.dart';

class GridListItem {
  String? title;
  String? content;
}

@immutable
class HomeContent1 extends StatelessWidget {
  const HomeContent1({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: InkWell(
          onTap: () {
            Navigator.of(context)
                .push(MaterialPageRoute(builder: (BuildContext context) {
              return const ProductSearchHistory();
            }));
          },
          child: Ink(
            child: Row(
              children: const [
                Expanded(child: Text("find the product here")),
                Icon(Icons.search)
              ],
            ),
          ),
        ),
      ),
      body: Container(
        constraints: const BoxConstraints.expand(),
        padding: const EdgeInsets.all(13),
        child: Column(
          children: [
            Expanded(
              child: GridView.builder(
                itemCount: 55,
                clipBehavior: Clip.antiAliasWithSaveLayer, //控制滾動時超出部分是否會被遮罩
                gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 2,
                  crossAxisSpacing: 5,
                  childAspectRatio: 0.95,
                ), //childAspectRatio用來設定item的寬高比
                scrollDirection: Axis.vertical,
                physics: const AlwaysScrollableScrollPhysics(),
                itemBuilder: (context, index) {
                  return Container(
                    margin: const EdgeInsets.only(
                        left: 0, top: 5, right: 0, bottom: 0),
                    child: InkWell(
                      highlightColor: Colors.lightBlue,
                      onTap: () {
                        Navigator.push(context,
                            MaterialPageRoute(builder: (BuildContext context) {
                          return ProductDetail();
                        }));
                      },
                      child: Ink(
                        padding: const EdgeInsets.all(15),
                        decoration: BoxDecoration(
                            color: Colors.grey,
                            borderRadius: BorderRadius.circular(5)),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                             Expanded(
                                child: Image(
                                    image: NetworkImage(
                                        "${AppHelper.shared.getBkDomainName()}/images/2022-12-07T01:26:27.048Z_u=1668716973,532930897&fm=253&fmt=auto&app=138&f=JPEG.webp"))),
                            Padding(
                              padding: const EdgeInsets.fromLTRB(0, 8, 0, 0),
                              child: Text("Title $index"),
                            ),
                            Padding(
                              padding: const EdgeInsets.fromLTRB(0, 8, 0, 0),
                              child: Text("Content $index"),
                            ),
                            const Padding(
                              padding: EdgeInsets.fromLTRB(0, 8, 0, 0),
                              child: Text("Price: \$5"),
                            ),
                          ],
                        ),
                      ),
                    ),
                  );
                },
              ),
            )
          ],
        ),
      ),
    );
  }
}
